<extend name='./Base' />
<block name='admin-content-body'>

	<div class="admin-content-body">
		<div class="am-cf am-padding">
			<div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">首页</strong> / <small>Home</small></div><iframe name="weather_inc" style="margin-top:9px;margin-left:10px;float:right" src="http://i.tianqi.com/index.php?c=code&id=11" width="500" height="19" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" ></iframe>
		</div>

		<ul class="am-avg-sm-1 am-avg-md-4 am-margin am-padding am-text-center admin-content-list ">
			<li><a href="{:U('articles/alist')}" class="am-text-success"><span class="am-icon-btn am-success am-icon-file-text"></span><br/>文章总数<br/>{$articleCount}</a></li>
			<li><a href="javascript:;" class="am-text-warning"><span class="am-icon-btn am-warning am-icon-commenting"></span><br/>评论总数<br/>{$commentCount}</a></li>
			<li><a href="{:U('articles/alist')}" class="am-text-danger"><span class="am-icon-btn am-danger am-icon-level-up"></span><br/>本月新增文章<br/>{$monthCount}</a></li>
			<li><a href="{:U('messages/index')}" class="am-text-secondary"><span class="am-icon-btn am-primary am-icon-comments"></span><br/>留言总数<br/>{$messageCount}</a></li>
		</ul>

		<div class="am-u-sm-12">
			<div class="am-u-md-6">
				<div class="am-panel am-panel-success">
					<div class="am-panel-hd am-cf" data-am-collapse="{target: '#collapse-panel-1'}">您当前登录位置<span class="am-icon-chevron-down am-fr" ></span></div>
					<div id="collapse-panel-1" class="am-in"  style="max-height: 400px;overflow-y: auto;">
						<div id="allmap" style="width: 100%;height: 300px"></div>
					</div>
				</div>
			</div>

			<div class="am-u-md-6">
				<div class="am-panel am-panel-success">
					<div class="am-panel-hd am-cf" data-am-collapse="{target: '#collapse-panel-2'}">系统信息<span class="am-icon-chevron-down am-fr" ></span></div>
					<div id="collapse-panel-2" class="am-in" style="max-height: 400px;overflow-y: auto;">
						<table class="am-table am-table-bordered am-table-radius am-table-striped" style="margin-bottom: 0">
							<volist name="info" id="v">
								<tr>
									<td class="text">{$key}：</td>
									<td class="input">{$v}</td>
								</tr>
							</volist>
						</table>
					</div>
				</div>
			</div>
		</div>
		<if condition="F('webSet')['qqLogin'] eq 1">
			<div class="am-u-sm-12">
				<div class="am-u-md-12">
					<div class="am-panel am-panel-warning">
						<div class="am-panel-hd am-cf" data-am-collapse="{target: '#collapse-panel-8'}">最近登录的人<span class="am-icon-chevron-down am-fr" ></span></div>
						<div class="am-panel-bd am-collapse am-in am-cf" id="collapse-panel-8">
							<table class="am-table am-table-bordered am-table-radius am-table-striped" style="margin-bottom: 0;text-align: center;">
								<tr>
									<td>ID</td>
									<td>头像</td>
									<td>昵称</td>
									<td>性别</td>
									<td>openid</td>
									<td>省份</td>
									<td>城市</td>
									<td>出生日期</td>
									<td>登录时间</td>
								</tr>
								<if condition="!empty($visitors)">
									<volist name="visitors" id="v">
										<tr>
											<td class="text">{$v['id']}</td>
											<td class="input">
												<img src="{$v['figureurl']}" width="30px">
											</td>
											<td class="input">{$v['nickname']}</td>
											<td class="input">{$v['gender']}</td>
											<td class="input">{$v['openid']}</td>
											<td class="input">{$v['province']}</td>
											<td class="input">{$v['city']}</td>
											<td class="input">{$v['birthyear']}</td>
											<td class="input">{$v['login_time']|date='Y-m-d H:i',###}</td>
										</tr>
									</volist>
									<else />
									<tr>
										<td colspan="8">没有数据</td>
									</tr>
								</if>
							</table>
						</div>
					</div>
				</div>
			</div>
		</if>
		<div class="am-u-sm-12">
			<div class="am-u-md-6">
				<div class="am-panel am-panel-danger">
					<div class="am-panel-hd am-cf" data-am-collapse="{target: '#collapse-panel-3'}">最近评论<span class="am-icon-chevron-down am-fr" ></span></div>

					<div class="am-panel-bd am-collapse am-in am-cf" id="collapse-panel-3" style="max-height: 450px;overflow-y: auto;">
						<ul class="am-comments-list admin-content-comment">

							<foreach name="nearComments" item='c'>
								<li class="am-comment" id="message_{$c['id']}">
									<a href="#"><img
										<if condition="F('webSet')['qqLogin'] eq 1">
											<if condition="!empty($c['avatar'])">
												src="{$c['avatar']}"
												<else />
												src="__PUBLIC__/static/home/images/avatars/{$c['id']%10}.jpg"
											</if>
											<else />
											src="__PUBLIC__/static/home/images/avatars/{$c['id']%10}.jpg"
										</if>
										class="am-comment-avatar" width="48" height="48"></a>
									<div class="am-comment-main">
										<header class="am-comment-hd">
											<div class="am-comment-meta"><a href="#" class="am-comment-author">{$c['nickname']}</a> 评论于 <time>{$c['create_time']|date='Y-m-d H:i:s',###}</time>
											</div>
										</header>
										<div class="am-comment-bd"><p>{$c['comment']}
											<br>来自<a href="{:U('/home/index/article/id/'.$c['aid'])}" target="_blank">《{$c['title']|mb_substr=###,0,13,'utf-8'}...》</a>的评论</p>
										</div>
										<div class="am-comment-footer am-comment-actions" style="cursor: pointer;">
											<span onclick="replayc({$c['id']},'{$c['nickname']}',{$c['article_id']})"><i class="am-icon-reply"></i>回复</span>
											&nbsp;&nbsp;来自&nbsp;&nbsp;{$c['systemos']}&nbsp;&nbsp;的&nbsp;{$c['browser']}浏览器
											<div style="float: right;color: red;cursor: pointer;"><span onclick="deletec({$c['id']})"><i class="am-icon-trash-o"></i>删除</span>
											</div>
										</div>
									</div>
								</li>
							</foreach>

						</ul>
					</div>
				</div>
			</div>

			<div class="am-u-md-6">
				<div class="am-panel am-panel-danger">
					<div class="am-panel-hd am-cf" data-am-collapse="{target: '#collapse-panel-4'}">最近留言<span class="am-icon-chevron-down am-fr" ></span></div>

					<div class="am-panel-bd am-collapse am-in am-cf" id="collapse-panel-4" style="max-height: 450px;overflow-y: auto;">
						<ul class="am-comments-list admin-content-comment">

							<foreach name="nearMessages" item='m'>
								<li class="am-comment" id="message_{$m['id']}">
									<a href="#"><img
										<if condition="F('webSet')['qqLogin'] eq 1">
											<if condition="!empty($m['avatar'])">
												src="{$m['avatar']}"
												<else />
												src="__PUBLIC__/static/home/images/avatars/{$m['id']%10}.jpg"
											</if>
											<else />
											src="__PUBLIC__/static/home/images/avatars/{$m['id']%10}.jpg"
										</if>
										class="am-comment-avatar" width="48" height="48"></a>
									<div class="am-comment-main">
										<header class="am-comment-hd">
											<div class="am-comment-meta"><a href="#" class="am-comment-author">{$m['nickname']}</a> 评论于 <time>{$m['create_time']|date='Y-m-d H:i:s',###}</time>
											</div>
										</header>
										<div class="am-comment-bd"><p>{$m['message']}</p>
										</div>
										<div class="am-comment-footer am-comment-actions" style="cursor: pointer;">
											<span onclick="replaym({$m['id']},'{$m['nickname']}')"><i class="am-icon-reply"></i>回复</span>
											&nbsp;&nbsp;来自&nbsp;&nbsp;{$m['systemos']}&nbsp;的&nbsp;{$m['browser']}浏览器
											<div style="float: right;color: red;cursor: pointer;"><span onclick="deletem({$m['id']})"><i class="am-icon-trash-o"></i>删除</span>
											</div>
										</div>
									</div>
								</li>
							</foreach>

						</ul>
					</div>
				</div>
			</div>
		</div>

		<div class="am-u-sm-12">
			<div class="am-u-md-4">
				<div class="am-panel am-panel-primary">
					<div class="am-panel-hd am-cf" data-am-collapse="{target: '#collapse-panel-5'}">文章分类统计-饼图<span class="am-icon-chevron-down am-fr" ></span></div>

					<div class="am-panel-bd am-collapse am-in am-cf" id="collapse-panel-5">
						<div style="width:100%;text-align:center">
							<canvas id="canvas1" height="750" width="750"></canvas>
						</div>
					</div>
				</div>
			</div>

			<div class="am-u-md-8">
				<div class="am-panel am-panel-primary">
					<div class="am-panel-hd am-cf" data-am-collapse="{target: '#collapse-panel-6'}">文章分类统计-柱状图<span class="am-icon-chevron-down am-fr" ></span></div>

					<div class="am-panel-bd am-collapse am-in am-cf" id="collapse-panel-6">
						<div style="width:100%;text-align:center">
							<canvas id="canvas2" height="750" width="1680"></canvas>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div class="am-u-sm-12">
			<div class="am-u-md-12">
				<div class="am-panel am-panel-secondary">
					<div class="am-panel-hd am-cf" data-am-collapse="{target: '#collapse-panel-7'}">近30次新增文章<span class="am-icon-chevron-down am-fr" ></span></div>

					<div class="am-panel-bd am-collapse am-in am-cf" id="collapse-panel-7">
						<div style="width:100%;text-align:center">
							<canvas id="canvas3" height="750" width="1680"></canvas>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

</block>
<block name="js">
	<script type="text/javascript">
		$(document).ready(function(){
			$("#allmap").height($("#collapse-panel-2").outerHeight(true));
			$(window).resize(function(){
				$("#allmap").height($("#collapse-panel-2").outerHeight(true));
			})
		});
		function replaym(id,nickname){
			layer.prompt({title: '回复'+nickname, formType: 2}, function(text, index){
				layer.close(index);
				$.post('{:U("messages/replay")}',{'message':text,'id':id},function(res){
					if(res.status){
						layer.msg(res.msg);
					}else{
						layer.alert(res.msg);
					}
				});
			});
		}
		function deletem(id) {
			layer.confirm('确定要删除？不可恢复', {
				btn: ['确定','取消']
			},function(){
				$.post('{:U("messages/deletemsg")}',{'id':id,'delete':1},function(res){
					if(res.status){
						$("#message_"+id).remove();
						layer.msg(res.msg);
					}else{
						layer.alert(res.msg,{icon:5});
					}
				});
			},function(){})
		}

		function replayc(id,nickname,aid){
			layer.prompt({title: '回复'+nickname, formType: 2}, function(text, index){
				layer.close(index);
				$.post('{:U("comments/replay")}',{'comment':text,'id':id,'article_id':aid},function(res){
					if(res.status){
						layer.msg(res.msg);
					}else{
						layer.alert(res.msg);
					}
				});
			});
		}
		function deletec(id) {
			layer.confirm('确定要删除？不可恢复', {
				btn: ['确定','取消']
			},function(){
				$.post('{:U("comments/deleteComment")}',{'id':id,'delete':1},function(res){
					if(res.status){
						$("#message_"+id).remove();
						layer.msg(res.msg);
					}else{
						layer.alert(res.msg,{icon:5});
					}
				});
			},function(){})
		}
	</script>
	<script type="text/javascript" src='__PUBLIC__/static/admin/js/Chart.js'></script>
	<script>
		/*随机颜色*/
		function getRandomColor(){
			var c = '#';
			var cArray = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F'];
			for(var i = 0; i < 6;i++) {
				var cIndex = Math.round(Math.random()*15);
				c += cArray[cIndex];
			}
			return c;
		}
		var pieDataArticle = [
		<?php foreach($pieData as $k=>$v):?>
		{
			value: {$v['count']},
			color:getRandomColor(),
					highlight: "#FF5A5E",
				label: "{$v['category']}"
		},
		<?php endforeach;?>
		];
		var barChartDataAtticle = {
			labels : [
			<?php foreach($pieData as $k=>$v):?>
		"{$v['category']}",
		<?php endforeach;?>
		],
		datasets : [
			{
				fillColor : "rgba(14, 144, 210,.5)",
				strokeColor : "rgba(14, 144, 210,.5)",
				highlightFill : "rgba(14, 144, 210,.5)",
				highlightStroke : "rgba(14, 144, 210,.5)",
				data : [
				<?php foreach($pieData as $k=>$v):?>
		{$v['count']},
		<?php endforeach;?>
		]
		}
		]
		}

		var lineChartDataArticle = {
			labels : [
			<?php foreach($lineData as $k=>$v):?>
		"{$v['time']}日",
		<?php endforeach;?>
		],
		datasets : [
			{
				label: "My Second dataset",
				fillColor : "rgba(14, 144, 210,.5)",
				strokeColor : "rgba(14, 144, 210,.5)",
				pointColor : "rgba(14, 144, 210,.5)",
				pointStrokeColor : "#fff",
				pointHighlightFill : "#fff",
				pointHighlightStroke : "rgba(14, 144, 210,.5)",
				data : [
					<?php foreach($lineData as $k=>$v):?>
					{$v['count']},
					<?php endforeach;?>
					]
			}
		]
		}
		window.onload = function(){
			var ctx1 = document.getElementById("canvas1").getContext("2d");
			var ctx2 = document.getElementById("canvas2").getContext("2d");
			var ctx3 = document.getElementById("canvas3").getContext("2d");
			window.pieDataArticle = new Chart(ctx1).Pie(pieDataArticle, {
				responsive: true
			});
			window.barChartDataAtticle = new Chart(ctx2).Bar(barChartDataAtticle, {
				responsive: true
			});
			window.lineChartDataArticle = new Chart(ctx3).Line(lineChartDataArticle, {
				responsive: true
			});
		}
	</script>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=T8YIcG4ASGG368MGdfYb7mTnjGGZ3zpA"></script>
	<script>
		// 百度地图API功能
		var map = new BMap.Map("allmap");
		var point = new BMap.Point(116.331398,39.897445);
		map.centerAndZoom(point,15);
		map.setMapStyle({style:'grayscale'});//地图主题
		map.addControl(new BMap.MapTypeControl());          //添加地图类型控件
		map.disable3DBuilding();
		map.enableScrollWheelZoom();                         //启用滚轮放大缩小

		var geolocation = new BMap.Geolocation();
		geolocation.getCurrentPosition(function(r){
			if(this.getStatus() == BMAP_STATUS_SUCCESS){
				var mk = new BMap.Marker(r.point);
				map.addOverlay(mk);
				map.panTo(r.point);
			}
			else {
				alert('failed'+this.getStatus());
			}
		},{enableHighAccuracy: true})
	</script>
</block>